<template>
  <ul>
    <li>总导演剧透杭州亚运会开幕式创意</li>
    <li>
      <!-- 声明式导航 -->
      <router-link to="/newsdetail?id=1001&name=zhangsan">
        新一轮存款利率下调即将落地
      </router-link>
    </li>
    <li>小杨哥称每个月工资支出5000万</li>
  </ul>
  <hr />
  <p>
    <button @click="store.add(8)">+</button>&nbsp;&nbsp;
    <button @click="store.minus(5)">-</button>
  </p>
  <br />
  <br />
  <p>
    <button @click="homeStore.setMenuList">获取菜单数据放在仓库中</button>
  </p>
</template>

<script setup>
import {
  onBeforeMount,
  onMounted,
  onBeforeUnmount,
  onUnmounted,
  onActivated,
  onDeactivated
} from 'vue'
import { useCounterStore } from '../stores/counter'
import { useHomeStore } from '../stores/home'
const store = useCounterStore()
const homeStore = useHomeStore()

// 即将挂在
onBeforeMount(() => {
  console.log('---NewsList----onBeforeMount---')
})

onMounted(() => {
  console.log('---NewsList----onMounted---')
})

// 激活
onActivated(() => {
  console.log('---NewsList----onActivated---')
})

// 失活
onDeactivated(() => {
  console.log('---NewsList----onDeactivated---')
})

// 卸载之前
onBeforeUnmount(() => {
  console.log('---NewsList----onBeforeUnmount---')
})

// 卸载之后
onUnmounted(() => {
  console.log('---NewsList----onUnmounted---')
})
</script>
